import { Component } from "react";
import { AtInput, AtForm, AtButton } from "taro-ui";
import Taro from "@tarojs/taro";
import "./register.scss";
export default class Register extends Component {
  constructor() {
    super(...arguments);
    this.state = {
      user: "",
      psd: "",
      phoneNum: "",
      sex: "",
      age: ""
    };
  }
  render() {
    return (
      <view className="register">
        <AtForm className="formBox">
          <AtInput
            name="user"
            title="用户名"
            type="text"
            placeholder="请输入账号"
            value={this.state.user}
            onChange={this.userChange.bind(this)}
          />
          <AtInput
            name="psd"
            title="密码"
            type="password"
            placeholder="请输入密码"
            value={this.state.psd}
            onChange={this.psdChange.bind(this)}
          />
          <AtInput
            name="sex"
            title="性别"
            type="sex"
            placeholder="请输入性别"
            value={this.state.sex}
            onChange={this.SexChange.bind(this)}
          />
          <AtInput
            name="age"
            title="年龄"
            type="age"
            placeholder="请输入年龄"
            value={this.state.age}
            onChange={this.ageChange.bind(this)}
          />
          <AtInput
            name="phoneNum"
            title="手机号"
            type="phoneNum"
            placeholder="请输入手机号"
            value={this.state.phoneNum}
            onChange={this.phoneNumChange.bind(this)}
          />
          <AtButton onClick={this.Register.bind(this)}>注册</AtButton>
        </AtForm>
      </view>
    );
  }
  userChange(value) {
    this.setState({
      user: value
    });
  }
  psdChange(value) {
    this.setState({
      psd: value
    });
  }
  SexChange(value) {
    this.setState({
      sex: value
    });
  }
  ageChange(value) {
    this.setState({
      age: value
    });
  }
  phoneNumChange(value) {
    this.setState({
      phoneNum: value
    });
  }
  Register() {
    let params = {
      user: this.state.user,
      psd: this.state.psd,
      sex: this.state.sex,
      age: this.state.age,
      phoneNum: this.state.phoneNum
    };
    console.log(params);
    Taro.request({
      url: "https://dmyg.xyz:3000/register",
      method: "POST",
      data: params,
      success: res => {
        if (res.data.code == 201) {
          console.log(res.data.msg);
        } else {
          Taro.showToast({
            title: "注册成功",
            icon: "success",
            duration: 2000
          });
          setTimeout(() => {
            Taro.redirectTo({
              url: "../login/login"
            });
          }, 1000);
        }
        this.setState({
          user: "",
          psd: "",
          sex: "",
          age: "",
          phoneNum: ""
        });
      }
    });
  }
}
